<template>
  <div style="margin: 0px 10px 50px 10px;">
    <h3>公司信息:</h3>
    <el-form ref="tabe" :rules="rules" :model="tabe" label-width="100px">
      <el-form-item label="公司名称：" prop="companyname"  >
        <el-input v-if="chakan" v-model="tabe.name"></el-input>
         <span v-if="!chakan" v-text="tabe.name"></span>
      </el-form-item>
      <el-form-item label="公司类型：" prop="companytype" >
        <el-input v-if="chakan" v-model="tabe.companyType"></el-input>
         <span v-if="!chakan" v-text="tabe.companyType"></span>
      </el-form-item>
      <el-form-item label="公司位置：" prop="companyposition">
        <el-input v-if="chakan"  v-model="tabe.address"></el-input>
         <span v-if="!chakan" v-text="tabe.address"></span>
      </el-form-item>
    </el-form>

    <h3>面试信息：</h3>
    <span class="a1">面邀途径：</span>
    <el-select v-model="tabe.interviewChannel" placeholder="请选择" v-if="chakan">
      <el-option 
        v-for="item in tujin"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
       <span v-if="!chakan" v-text="tabe.interviewChannel"></span>
    </el-select>
    面邀平台：
    <el-select v-model="tabe.interviewPlatform" placeholder="请选择" v-if="chakan">
      <el-option
        v-for="item in pintai"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option> </el-select>
     <span v-if="!chakan" v-text="tabe.interviewPlatform"></span><br /><br />
    <el-form ref="tabe" :model="tabe" label-width="112px">
      <el-form-item label="岗位类型：">
        <el-input v-if="chakan" v-model="tabe.postType" style="with: 200px"></el-input>
         <span v-if="!chakan" v-text="tabe.postType"></span>
      </el-form-item>
      <el-form-item label="面试岗位：">
        <el-input v-if="chakan" v-model="tabe.postName"></el-input>
         <span v-if="!chakan" v-text="tabe.postName"></span>
      </el-form-item>
      <el-form-item label="面试时间：">
        <el-date-picker v-if="chakan"
          v-model="tabe.interviewTime"
          type="date"
          placeholder="选择日期"
        >
        </el-date-picker>
         <span v-if="!chakan" v-text="tabe.interviewTime"></span>
      </el-form-item>
      <el-form-item label="岗位设定薪资：">
        <el-input v-if="chakan" v-model="tabe.postSalary"></el-input>
         <span v-if="!chakan" v-text="tabe.postSalary"></span>
      </el-form-item>
      <el-form-item label="岗位要求补充：">
        <el-input v-if="chakan" v-model="tabe.postNeed"></el-input>
         <span v-if="!chakan" v-text="tabe.postNeed"></span>
      </el-form-item>
    </el-form>

    <h3>联系方式:</h3>
    <el-form ref="tabe" :model="tabe" label-width="120px">
      <el-form-item label="公司联系人：">
        <el-input v-if="chakan" v-model="tabe.companyStaff" style="with: 200px"></el-input>
         <span v-if="!chakan" v-text="tabe.companyStaff"></span>
      </el-form-item>
      <el-form-item label="联系人岗位：">
        <el-input v-if="chakan" v-model="tabe.companyStaffPost"></el-input>
         <span v-if="!chakan" v-text="tabe.companyStaffPost"></span>
      </el-form-item>
      <el-form-item label="联系人电话：">
        <el-input v-if="chakan" v-model="tabe.companyStaffTell"></el-input>
         <span v-if="!chakan" v-text="tabe.companyStaffTell"></span>
      </el-form-item>
      <el-form-item label="联系人微信：">
        <el-input v-if="chakan" v-model="tabe.companyStaffWx"></el-input>
         <span v-if="!chakan" v-text="tabe.companyStaffWx"></span>
      </el-form-item>
      <el-form-item label="联系人QQ：">
        <el-input v-if="chakan" v-model="tabe.companyStaffQq"></el-input>
         <span v-if="!chakan" v-text="tabe.companyStaffQq"></span>
      </el-form-item>
    </el-form>

    <h3>面试结果：</h3>
    <span class="a1">面试结果：</span>
    <el-select v-model="tabe.result" placeholder="请选择" v-if="chakan">
      <el-option
        v-for="item in jieguo"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
     <span v-if="!chakan" v-text="tabe.result"></span>
    是否一面：
    <el-select v-model="tabe.isFrist" placeholder="请选择" v-if="chakan">
      <el-option
        v-for="item in yimian"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
     <span v-if="!chakan" v-text="tabe.isFrist"></span>
    是否进入下轮：
    <el-select v-model="tabe.isNext" placeholder="请选择" v-if="chakan">
      <el-option
        v-for="item in yimian"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
     <span v-if="!chakan" v-text="tabe.isNext"></span>
    是否录用：
    <el-select v-model="tabe.isLy" placeholder="请选择" v-if="chakan">
      <el-option
        v-for="item in yimian"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option> </el-select>
       <span v-if="!chakan" v-text="tabe.isLy"></span>
      <br /><br />
    <el-form ref="tabe" :model="tabe" label-width="120px">
      <el-form-item label="第几次面试">
        <el-input v-if="chakan" v-model="tabe.interviewTimes" style="with: 200px"></el-input>
         <span v-if="!chakan" v-text="tabe.interviewTimes"></span>
      </el-form-item>
      <el-form-item label="结果描述">
        <el-input v-if="chakan" type="textarea" v-model="tabe.resultDesc"></el-input>
         <span v-if="!chakan" v-text="tabe.resultDesc"></span>
      </el-form-item>
      <el-form-item label="面试感想">
        <el-input v-if="chakan" type="textarea" v-model="tabe.feeling"></el-input>
         <span v-if="!chakan" v-text="tabe.feeling"></span>
      </el-form-item>
      <h3>面试问题：</h3>
    </el-form>

    <div id="Test" style="height: 350px" v-if="chakan">
      <quill-editor ref="myTextEditor" v-model="tabe.remark" :options="quillOption" style="height: 300px">
      </quill-editor>
    </div>
     <span v-if="!chakan" v-html="tabe.remark"></span>

    <el-form ref="tabe" :model="tabe" label-width="120px" style="margin-left: 1000px;">
      <el-form-item v-if="chakan">
        <el-button type="primary" @click="bianji">提交</el-button>
        <el-button type="primary" @click="chongzhi">重置</el-button>
      </el-form-item>
      
        <div class="grid-content bg-purple" v-if="!chakan">
          <el-button
            type="primary"
            @click="onSubmit"
            icon="el-icon-circle-close"
            >返回</el-button
          >
        </div>
    </el-form>
  </div>
</template>
<script>
import { mianshiupdate, mianshiinsert } from "@/api/mianshi";
import { quillEditor } from "vue-quill-editor";
import quillConfig from "../quill-config";

export default {
  components: {
    quillEditor,
  },
  data() {
    return {
      tabe: {
        infoId: null,
        name: null,
        address: null,
        companyType: null,
        interviewChannel: null,
        interviewPlatform: null,
        postType: null,
        postName: null,
        interviewTime: null,
        postNeed: null,
        postSalary: null,
        companyStaff: null,
        companyStaffPost: null,
        companyStaffTell: null,
        companyStaffWx: null,
        companyStaffQq: null,
        result: null,
        resultDesc: null,
        feeling: null,
        isFrist: null,
        isNext: null,
        isLy: null,
        interviewTimes: null,
        q1: null,
        a1: null,
        q2: null,
        a2: null,
        q3: null,
        a3: null,
        q4: null,
        a4: null,
        q5: null,
        a5: null,
        q6: null,
        a6: null,
        remark:null
      },
      activeName: "first",
      tujin: [
        {
          value: "公司推荐",
          label: "公司推荐",
        },
        {
          value: "学员推荐",
          label: "学员推荐",
        },
        {
          value: "其他",
          label: "其他",
        },
      ],
      pintai: [
        {
          value: "Boos直聘",
          label: "Boos直聘",
        },
        {
          value: "58同城",
          label: "58同城",
        },
      ],
      jieguo: [
        {
          value: "通过",
          label: "通过",
        },
        {
          value: "待定",
          label: "待定",
        },
        {
          value: "未通过",
          label: "未通过",
        },
      ],
      yimian: [
        {
          value: "是",
          label: "是",
        },
        {
          value: "否",
          label: "否",
        },
      ],
      rules: {
        companyname: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
        ],
        companytype: [
          { required: true, message: "请输入公司类型", trigger: "blur" },
        ],
        companyposition: [
          { required: true, message: "请输入公司地址", trigger: "blur" },
        ],
      },
      quillOption: quillConfig,
      chakan:true
    };
  },
  methods: {
    bianji() {
      if(this.tabe.name != null){
         if (this.tabe.infoId == null) {
        this.tianjia();
      } else {
        this.xiugai();
      }
      }
    },

    tianjia() {
      mianshiinsert(this.tabe).then((response) => {
        console.log(response.data);
      }),
        this.$router.push({ path: "/from/index" });
    },
    xiugai() {
      mianshiupdate(this.tabe).then((response) => {
        console.log(response.data);
      }),
        this.$router.push({ path: "/from/index" });
    },
    chongzhi(){
      this.tabe=null
    },
    onSubmit(){
      this.$router.push({path:"/from/index"})
    }
  },
  created() {
    /**  接收对象  **/
    const data = this.$route.query.row;
    //   console.log("------------------------------")
    //   console.log(data)
    if (data != undefined || data != null) {
      this.tabe = data;
    }
     const look = this.$route.query.look;
     if (look != undefined || look != null) {
      this.chakan = false;
    }
  },
};
</script>
<style scoped>
.a1 {
  margin-left: 50px;
}
.AA{
  width: 300px;
}
.BB{
  float: left;
  margin-right: 100px;
}
</style>